import { defineComponent, computed } from 'vue'
import $style from './index.module.scss'

export default defineComponent({
    name: 'SvgIcon',
    props: {
        prefix: {
            type: String,
            default: 'icon'
        },
        name: {
            type: String,
            required: true
        },
        color: {
            type: String,
            default: '#333'
        }
    },
    setup(props) {
        const symbolId = computed(() => `#${props.prefix}-${props.name}`);

        return () => (<svg aria-hidden="true" class={$style.svgIconSpin}>
            <use xlink:href={symbolId.value} fill={props.color} />
        </svg>);
    }
})